<template>
  <el-dialog
    width="400px"
    :title="`Volume set ${label}`"
    :visible.sync="visible"
    append-to-body
    @close="closeBatch"
  >
    <el-input
      v-if="label === 'quantity'"
      v-model.number="value"
      :placeholder="`Please enter ${label}`"
    />
    <el-input v-else v-model="value" :placeholder="`Please enter ${label}`" />

    <div slot="footer" class="dialog-footer">
      <el-button @click="closeBatch">Cancel</el-button>
      <el-button type="primary" @click="submitData">Confirm</el-button>
    </div>
  </el-dialog>
</template>

<script>
export default {
  props: {
    label: {
      type: String,
      required: true
    }
  },
  data() {
    return {
      visible: true,
      value: null
    };
  },
  methods: {
    closeBatch() {
      this.$emit('closeBatch');
    },
    submitData() {
      // 校验
      this.$emit('closeBatch', this.value);
    }
  }
};
</script>
<style lang="scss" scoped></style>
